Allow granular routine frequencies like 5/2w

1 files changed, 13 insertions, 16 deletions

diff --git a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
index 359fd5b..bd74b90 100644
--- a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
+++ b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
@@ -5,11 +5,8 @@
 	import StatusBadge from '$lib/components/StatusBadge.svelte';
 	import Button from '$lib/components/Button.svelte';
 	import Row from '$lib/components/Row.svelte';
-	import {
-		formatFrequency,
-		parseIntervalToDays,
-		computeHealthSeries,
-	} from '$lib/shared/routine-metrics';
+	import { computeHealthSeries } from '$lib/shared/routine-metrics';
+	import { Frequency } from '$lib/shared/frequency';
 	import { formatDayMonth, formatDayMonthYear } from '$lib/shared/temporal';
 	import SectionTitle from '$lib/components/SectionTitle.svelte';
 	let { data, form } = $props();
@@ -31,7 +28,7 @@
 	});
 	$effect(() => {
 		name = data.routine.name;
-		frequency = `${data.routine.frequencyDays}d`;
+		frequency = data.routine.frequency;
 		description = data.routine.description;
 	});
 	$effect(() => {
@@ -41,7 +38,7 @@
 			return () => clearTimeout(t);
 		}
 	});
-	const frequencyDays = $derived(parseIntervalToDays(frequency));
+	const freq = $derived(Frequency.safeParse(frequency));
 	const frozenAt = $derived(
 		data.routine.archived
 			? Temporal.Instant.from(data.routine.archivedAt ?? data.routine.createdAt)
@@ -99,16 +96,16 @@
 				/>
 			</label>
 			<label>
-				<span class="form-label">Intervalle</span>
+				<span class="form-label">Fréquence</span>
 				<input
 					class="form-input frequency"
-					class:input-invalid={frequency !== '' && frequencyDays === null}
+					class:input-invalid={frequency !== '' && freq === null}
 					type="text"
-					name="frequencyDays"
+					name="frequency"
 					bind:value={frequency}
-					placeholder="2w"
+					placeholder="2w, 5/2w"
 					autocomplete="off"
-					aria-label="Intervalle (ex: 1d, 2w, 3m)"
+					aria-label="Fréquence (ex : 2w, 5/2w)"
 				/>
 			</label>
 			<label>
@@ -122,11 +119,11 @@
 					autocomplete="off"
 				></textarea>
 			</label>
-			{#if frequency !== '' && frequencyDays === null}
-				<p class="error">Intervalle invalide — ex : 1d, 2w, 3m, 1y</p>
+			{#if frequency !== '' && freq === null}
+				<p class="error">Fréquence invalide — ex : 1d, 2w, 5/2w</p>
 			{/if}
 			<Button
-				disabled={!name.trim() || frequencyDays === null}
+				disabled={!name.trim() || freq === null}
 				style="position: relative; padding-right: 2.75rem;"
 			>
 				<span>Enregistrer</span>
@@ -151,7 +148,7 @@
 					overdueDays={data.state.overdueDays}
 				/>
 				<span class="chart-meta">
-					{formatFrequency(data.routine.frequencyDays)}
+					{Frequency.parse(data.routine.frequency).format()}
 					{#if data.state.lastDoneAt}
 						· fait le {formatDayMonth(data.state.lastDoneAt)}
 					{:else}